<template>
	<view id="header" :style="'text-align:'+position">
		<image mode="widthFix" style="width:60%;" src="@/static/img/logo-long.png" ></image>
		<view v-if="position=='left'" v-show="exitShow">
			<button type="warn" size="mini" @click="back">退出房间</button>
		</view>
	</view>
	<view id="exit" v-if="exitFlag">
		<uni-popup-dialog ref="exitDialog"  title="您确认要退出房间吗?" @close="close"  @confirm="backConfirm" ></uni-popup-dialog>
	</view>
</template>

<script>
	export default {
	  props: {
		  position:{type:String,default:'center'},
		  exitShow:{type:Boolean,default:false}
	  },
	  data(){
		  return{
			  exitFlag:false
		  }
	  },
	  methods:{
		  back(){
			  this.exitFlag=true;
		  },
		  close(){
			  this.exitFlag=false;
		  },
		  backConfirm(){
			  this.exitFlag=false;
			  uni.redirectTo({
			  	url: '/pages/index/index'
			  });
			  // uni.navigateBack(1);
		  }
	  }
	}
</script>

<style>
	/* #container #header{text-align: center;} */
	#header{padding:50rpx 0;display: flex;justify-content: space-between;}
	#exit{position: absolute;z-index:9999;top:50%;left:50%;transform: translate(-50%, -50%); }
</style>